Skip to content

Fix: Resolve 'Buffer is not defined' error for mobile devices (android)#266

Open
onefckcps wants to merge 1 commit intojames-tindal:mainfrom
onefckcps:fix/mobile-devices
Open

Fix: Resolve 'Buffer is not defined' error for mobile devices (android)#266
onefckcps wants to merge 1 commit intojames-tindal:mainfrom
onefckcps:fix/mobile-devices

Conversation

@onefckcps
Copy link
Copy Markdown

Fix: Resolve 'Buffer is not defined' error for browser/mobile compatibility

Problem:

This PR addresses a ReferenceError: Buffer is not defined that occurs when running the plugin in non-Node.js environments, such as Obsidian mobile (tested on Android) or potentially web browsers. This error prevents the plugin from loading or functioning correctly in these environments.

Solution:

The root cause appears to be the build configuration targeting or assuming a Node.js environment. This leads to issues when dependencies (potentially gray-matter or others involved in processing) rely on Node-specific globals like Buffer.

This PR adjusts the build configuration files (webpack.config.ts, tsconfig.json, package.json) to produce a build compatible with standard browser/JavaScript environments where Buffer is not natively available. The primary change involved ensuring the Webpack build does not explicitly target Node.js.

Testing:

Manually tested on an Android tablet where the error previously occurred consistently. After applying these changes and rebuilding, the plugin loads and functions without the Buffer reference error.

Related Issues:

(Optional: If this PR fixes an existing issue reported on the original repository, uncomment and replace #issue_number below)

…ompatibility

Adjusted build configuration (Webpack, tsconfig, package.json) to prevent runtime errors related to the missing Node.js 'Buffer' global in non-Node environments like Obsidian mobile.
@james-tindal
Copy link
Copy Markdown
Owner

james-tindal commented Apr 24, 2025

Thanks.

What is the ts-node loader supposed to do?

Looks like markmap is depending on node:stream so we'll have to find a polyfill for that.

@onefckcps
Copy link
Copy Markdown
Author

Hey!

You're right, I also tried reverting the build script back to just webpack --mode production to double-check. Without the ts-node loader, I consistently get the following error:

[webpack-cli] Failed to load '/home/simon/git/obsidian-mindmap-nextgen/webpack.config.ts' config [webpack-cli] TypeError: Unknown file extension ".ts"

Through a quick search I figured out:

When pnpm run build is executed, it ultimately tries to run the webpack.config.ts file to get the configuration for Webpack. However, Node.js (the runtime environment executing webpack-cli) cannot natively understand or execute TypeScript files directly, especially when the project is set to use ES Modules ("type": "module"). It expects JavaScript. This leads to the TypeError: Unknown file extension ".ts".

The ts-node/esm loader bridges this gap. It allows Node.js to transpile the TypeScript configuration file (webpack.config.ts) into JavaScript "on-the-fly" in memory. This way, Node.js can execute the configuration, retrieve the settings, and then Webpack can proceed with bundling the actual plugin source code from the src/ directory using the loaders defined within that configuration (like esbuild-loader).

So, it's specifically needed to handle the initial loading of the .ts config file itself by Node.js.


I am a newcomer to TypeScript, webpack, and Obsidian plugin development, so please correct me if I am wrong or if I misunderstand something :)

@james-tindal
Copy link
Copy Markdown
Owner

james-tindal commented Apr 26, 2025

The latest version of Node supports a limited set of typescript features. Works fine for me.

How did you get Android Obsidian to run the unpublished plugin?
I've not been able to find an option to load unpublished plugins on iPhone.

@onefckcps
Copy link
Copy Markdown
Author

I just compiled the project and moved the plugin files (main.js, manifest.js, style.css) in the plugin folder (.obsidian/plugins/obsidian-mindmap-nextgen/) and restarted the app.

For mobile debugging i have used this method: https://docs.obsidian.md/Plugins/Getting+started/Mobile+development#Android

That way i was able to see the console errors

@james-tindal
Copy link
Copy Markdown
Owner

james-tindal commented May 7, 2025

Instead of polyfilling Buffer, I'm working on removing gray-matter. Will get this fixed as soon as I can. Thanks for pointing me in the right direction.

@james-tindal james-tindal force-pushed the main branch 2 times, most recently from 1317043 to 106752e Compare April 14, 2026 17:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants